define([ "myHandle", 'Tree', 'Step', 'Popover', 'common' ], function (myHandle, Tree, Step, Popover, common) {
    'use strict';

    var currentPage = {
        /**
         * 显示自定义树形
         */
        treeInit: function(){
            var treeData = [
                {
                    name:"1",
                    key:"1",
                    children:[
                        {
                            name:"1-1",
                            key:"1-1",
                            children:[
                                { name:"1-1-1", key:"1-1-1" },
                                { name:"1-1-2", key:"1-1-2" }
                            ]
                        },
                        {
                            name:"1-2",
                            key:"1-2",
                            children:[
                                { name:"1-2-1", key:"1-2-1" },
                                { name:"1-2-2", key:"1-2-2" }
                            ]
                        },
                        {
                            name:"1-3",
                            key:"1-3",
                            children:[
                                { name:"1-3-1", key:"1-3-1" },
                                { name:"1-3-2", key:"1-3-2" }
                            ]
                        }
                    ]
                }
            ]
            var keys = [ '1', '1-1', '1-1-2', '1-1-1', '1-3-2', '1-2' ];
            console.log('running index');
            new Tree({
                id: "myTree",
                showKey: "name",
                key: "value",
                children: "children",
                data: [
                    {
                        name:"1-1",
                        value: "1-1",
                        children:[
                            { name:"1-1-1", value:"1-1-1" },
                            {
                                name:"1-1-2",
                                value:"1-1-1",
                                children:[
                                    { name:"1-1-2-1", value:"1-1-2-1" }
                                ]
                            }
                        ]
                    }
                ],
                onNodeClick: function(node){
                    console.log(node);
                }
            })

            var menuKeys = common.getMenuShowKeys(treeData, keys, 'key');
            console.log('menuKeys', menuKeys);
        },
        /**
         * 显示跳动的问题
         */
        showJumpText: function(){
            $("#jumpText").addClass('jump').html('<span>注</span><span>定</span>');
        },
        showMyStep: function(){
            var source = [
                { name: "这是第一步的描述信息", code: "01", date: "2019-10-22 15:20:22", msg: "这是一段描述信息这是一段描述信息这是一段描述信息这是一段描述信息这是一段描述信息这是一段描述信息这是一段描述信息这是一段描述信息这是一段描述信息这是一段描述信息这是一段描述信息这是一段描述信息这是一段描述信息这是一段描述信息这是一段信息这是一段描述信息这是一段描述信息这是一段描述信息" },
                { name: "第二步", code: "02", date: "2019-10-22 15:20:22", msg: "这是一段描述信息这是一段描述信息这是一段描述信息这是一段描述信息这描述信息这是一段描述信息这是一段描述信息" },
                { name: "第三步", code: "03", date: "2019-10-22 15:20:22", msg: "这是一段描述信息这是一段描述信息这是一段描述信息这是描述信息这是一段描述信息这是一段描述信息这是一段描述信息这是一段描述信息这是一段描述信息这是一段描述信息这是一段描述信息这是一段描述信息" },
                { name: "第四步", code: "04", date: "2019-10-22 15:20:22", msg: "这是一段描述信息这是一段描述信息这是一段描述信息这是一段描述信息这是一段描述信息这是一段描述信息这是一段描述信息这是一段描述信息这是一段描述信息这是一段描述信息这是一段描述信息这是一描述信息" }
            ];
            var myStep = new Step({
                id: "myStep",
                mode: "bottom",
                source: source,
                key: 'code',
                showKey: "name"
            })
            $(document).on('click', '#myStepBtns .btn', function(e){
                var type = $(e.target).data('type');
                var info = myStep.getCurrent();
                console.log(info);
                if(type == "pre"){
                    var preIndex = info.index - 1;
                    myStep.setStepIndex(preIndex < 0 ? 0 : preIndex);
                }else if(type == "next"){
                    var nextIndex = info.index + 1;
                    myStep.setStepIndex(nextIndex >= source.length ? source.length - 1 : nextIndex);
                }
            })
        },
        showPopover: function(){
            new Popover({
                el: "showPopover",
                showClose: true,
                outClickHide: true,
                content: '<div style="color: red;">this is message !</div>'
            })
        },
        init: function(){
            currentPage.showMyStep();
            currentPage.showPopover();
        }
    }

    return function () {
        return {
            htmlStr:(function(){
                var str = '<div>'
                    + '<div>index Page</div>'
                    + '<div id="jumpText"></div>'
                    + '<div id="myTree"></div>'
                    + '<div id="myStepBtns"><a class="btn" data-type="pre">pre</a><a class="btn" data-type="next">next</a></div>'
                    + '<div id="myStep"></div>'
                    + '<div id="popover"><a class="btn" id="showPopover">showPopover</a></div>'
                    + '</div>';
                return str;
            })(),
            render: function(){
                currentPage.init();
            }
        }
    }
});
